
@themeColor_00:#33495E;

.pop-mask{
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    position: absolute;
    z-index: 999;
    float: left;
    overflow: auto;
    top: 0;
    left: 0;
    animation: maskMoveInto 0.5s forwards;
    .pop-dialog{
        background-color: #FFF;
        margin: 0 auto;
        top: 0;
        position: relative;
        border-radius: 4px;
        overflow: hidden;
        animation: dialogMoveInto 0.3s forwards;
        .pop-dialog-head{
            display: flex;
            align-items: center;
            height: 40px;
            background-color: @themeColor_00;
            padding: 0 10px;
            color: #FFF;
            justify-content: space-between;
            i.fa-times{
                cursor: pointer;
            }
        }
        .pop-dialog-body{
            position: relative;
            background-color: #FFF;
            min-height: 100px;
            display: inline-block;
            width: 100%;
            overflow: auto;
            .alert-msg{
                text-align: center;
                padding: 30px;
                width: 100%;
                word-break: break-all;
                max-height: 300px;
                overflow: auto;
            }
        }
        .pop-dialog-foot{
            position: relative;
            display: flex;
            background-color: #F1F1F1;
            height: 45px;
            justify-content: flex-end;
            padding: 8px 0 8px 12px;
            button.btn{
                width: 70px;
                outline: none;
                margin-right: 10px;
                padding: 2px 0;
                height: 30px;
            }
        }
    }
}
@media screen and (max-width:470px) {
    .pop-mask{
        .pop-dialog{
            width: calc(~"100% - 16px");
            margin: 0 8px;
        }
    }
}

@keyframes dialogMoveInto {
    100%{
        top: 25px;
    }
}
@keyframes maskMoveInto {
    100%{
        background-color: rgba(0, 0, 0, 0.4);
    }
}
